﻿﻿<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>EasilyJ - 后台管理</title>
    <link rel="shortcut icon" href="/resources/assets/img/favicon.png">
    <link href="/resources/assets/css/bootstrap.css" rel="stylesheet"/>
    <link rel="stylesheet" href="/resources/editor/css/editormd.min.css"/>

    <script>
        var _hmt = _hmt || [];
        (function() {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?6cea6d2f867edafb9950a313c6de6818";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script>

</head>

<body style="background: #f7f7f9">

<form class="form-horizontal" style="padding: 20px; margin-top: 20px;">
    <div class="form-group container">
        <label class="col-sm-2 control-label">文章标题</label>
        <div class="col-sm-10">
            <input type="text" class="form-control articleId hide" value="${article.articleId}">
            <input type="text" class="form-control articleTitle" value="${article.articleTitle}">
        </div>
    </div>
    <div class="form-group container">
        <label class="col-sm-2 control-label">文章主分类</label>
        <div class="col-sm-4 col-sm-offset-3">
            <select class="form-control articleCategoryFirst">
                <c:forEach items="${articleCategoryListFirst}" var="articleCategory">
                    <option value="${articleCategory.articleCategoryId}"> ${articleCategory.articleCategoryTitle}</option>
                </c:forEach>
            </select>
        </div>
    </div>
    <div class="form-group container">
        <label class="col-sm-2 control-label">文章次分类</label>
        <div class="col-sm-4 col-sm-offset-3">
            <select class="form-control articleCategorySecond">
                <c:forEach items="${articleCategoryListSecond}" var="articleCategory">
                    <c:choose>
                        <c:when test="${articleCategory.articleCategoryId == article.articleParentId}">
                            <option value="${articleCategory.articleCategoryId}" selected> ${articleCategory.articleCategoryTitle}</option>
                        </c:when>
                        <c:when test="${articleCategory.articleCategoryId != article.articleParentId}">
                            <option value="${articleCategory.articleCategoryId}"> ${articleCategory.articleCategoryTitle}</option>
                        </c:when>
                    </c:choose>
                </c:forEach>
            </select>
        </div>
    </div>
    <div class="form-group container">
        <label class="col-sm-2 control-label">设置状态</label>
        <div class="col-sm-2 col-sm-offset-4">
            <label class="checkbox-inline">
                <input type="radio" class="articleState" name="articleState" value="0"> 发布
            </label>
            <label class="checkbox-inline">
                <input type="radio" class="articleState" name="articleState" value="1"> 存稿
            </label>
        </div>
    </div>
    <div class="form-group container">
        <label class="col-sm-2 control-label">文章图标</label>
        <div class="col-sm-10">
            <input type="text" class="form-control articleIcon" value="${article.articleIcon}">
        </div>
    </div>
    <div class="form-group">
        <div id="test-editormd">
                <textarea class="editormd-markdown-textarea" id="articleContent" name="test-editormd-markdown-doc" style="display: none;">${article.articleContent}</textarea>
        </div>
    </div>
    <div class="container text-center article-add-message">

    </div>
    <div class="container text-center">
        <div class="col-sm-12">
            <button type="button" class="btn btn-primary" id="updateArticleBtn" >更新文章</button>
            <button type="button" class="btn btn-success" onclick="window.location.href='/articleDetail?articleId=${article.articleId}'">查看文章</button>
            <button type="button" class="btn btn-default" onclick="window.location.href='/articleManage/articleList'">文章管理</button>
        </div>
    </div>
</form>

<script src="/resources/assets/js/jquery-3.3.1.min.js"></script>
<script src="/resources/editor/lib/marked.min.js"></script>
<script src="/resources/editor/lib/prettify.min.js"></script>
<script src="/resources/editor/lib/raphael.min.js"></script>
<script src="/resources/editor/lib/underscore.min.js"></script>
<script src="/resources/editor/lib/sequence-diagram.min.js"></script>
<script src="/resources/editor/lib/flowchart.min.js"></script>
<script src="/resources/editor/lib/jquery.flowchart.min.js"></script>
<script src="/resources/editor/editormd.min.js"></script>
<script src="/resources/js/manage.article.js"></script>
<script type="text/javascript">
    editormd.markdownToHTML("textContent");
    var testEditor;
    $(function () {
        testEditor = editormd("test-editormd", {
            height: 590,
            syncScrolling: "single",
            path: "/resources/editor/lib/",
            saveHTMLToTextarea: true,
            imageUpload: true,
            imageFormats: ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
            imageUploadURL: "/ftp/upload"
            // previewTheme : "dark"
        });

        // 设置选中主分类
        var acSecondId = $(".articleCategorySecond option:selected").val();
        $.ajax({
            type: "POST",
            url: "/articleManage/getArticleCategoryByFirstId",
            data: {acSecondId: acSecondId},
            dataType: "json",
            success: function (data) {
                var ac = data.articleCategory;
                $(".articleCategoryFirst option[value='"+ ac.articleCategoryId + "']").attr("selected", "selected");
            },
            error: function () {
                alert("设置选中主分类 bug");
            }
        });
        // 设置选中文章状态
        var articleState = '${article.articleState}';
        if (articleState == 0) {
            $(".articleState").eq(0).attr('checked', true);
        }
        if (articleState == 1) {
            $(".articleState").eq(1).attr('checked', true);
        }
    });
</script>

</body>

</html>